<div class="layui-fluid nepadmin-pad0 nepadmin-mar0 list0 memberlist" id="list" lay-title="会员管理">
	<div class="layui-fluid">
		<div class="layui-row layui-col-space15">
			<div class="layui-col-md12">
				<div class="layui-card hxr-layui-card" id="memberlistv">
					<div class="layui-form layui-card-header hxradmin-card-header">
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label">真实姓名</label>
								<div class="layui-input-inline">
									<input type="text" name="user" placeholder="请输入真实姓名" autocomplete="off" class="layui-input">
								</div>
							</div>
							<div class="layui-inline">
								<label class="layui-form-label">状态</label>
								<div class="layui-input-inline">
									<div class="layui-unselect layui-form-select">
										<div class="layui-select-title"><input name="status" type="text" placeholder="请选择状态" value="" readonly class="layui-input layui-unselect"><i
											 class="layui-edge"></i></div>
										<dl class="layui-anim layui-anim-upbit" style="">
											<dd lay-value="" class="layui-select-tips layui-this">请选择状态</dd>
											<dd data='1'>启动</dd>
											<dd data='2'>停用</dd>
										</dl>
									</div>
								</div>
							</div>
							<div class="layui-inline">
								<label class="layui-form-label" style='width:110px;'>会员注册日期范围</label>
								<div class="layui-input-inline" style="   width: 350px;">
									<input type="text" name="val2" id='date' autocomplete="off" class="layui-input" readonly>
								</div>
							</div>
							<div class="layui-inline">
							<button class="layui-btn" data-type="reload" id="search">搜索</button>
							</div>
							<div class="layui-inline">
								<button class="layui-btn" data-type="excel" id="pexcel">导出数据</button>
							</div>
						</div>
					</div>
					<div class="layui-card-body">
						<!-- <div>
							<button class="layui-btn layuiadmin-btn-list" data-type="batchdel">删除</button>
						</div> -->
						<table class="layui-hide" id="list-table" lay-filter="list-table"></table>
						<div id="list-toolbar" style="display: none;">
<!--							<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="recharge"><i class="layui-icon layui-icon-list"></i>充值记录</button>-->
<!--							<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="cons"><i class="layui-icon layui-icon-list"></i>消费记录</button>-->
							{{#  if(d.admin_id){ }}
							<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="admin_revoke"><i class="layui-icon layui-icon-delete"></i>取消绑定管理员</button>
							{{#  } else if(d.agent_id ) { }}
							<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="agent_revoke"><i class="layui-icon layui-icon-delete"></i>取消绑定代理</button>
							{{#  } else if( !d.agent_id) { }}
								{{#  if(!d.admin_id){ }}
							<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="distribute_agent"><i class="layui-icon layui-icon-edit"></i>绑定代理</button>
							<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="distribute_admin"><i class="layui-icon layui-icon-edit"></i>绑定管理员</button>
								{{#  } }}

							{{#  } }}
							<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="list"><i class="layui-icon layui-icon-list"></i>会员详情</button>
							<!--
			                <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a> -->
			</div>
					</div>
				</div>
				<script type="text/html" id="list-tableF">
								<input type="checkbox" name="member_status" lay-skin="switch" lay-text="启用|停用" lay-filter="list-tableF"
				   value="{{ d.member_status }}" data-json="{{ encodeURIComponent(JSON.stringify(d)) }}" {{ d.member_status == 1 ? 'checked' : '' }}>
				</script>
				<script type="text/html" id="sex">
				  {{#  if(d.sex === 1){ }}
					男
				  {{#  } else if(d.sex === 2) { }}
				    女
					{{#  } else if(d.sex === 0) { }}
					 保密
				  {{#  } }}
				</script>
				<script type="text/html" id="card_photo_head">
								  {{#  if(d.card_photo_head){ }}
									<img style="max-height: 100%;" src="{{d.card_photo_head}}" onclick="previewImg(this)">
								  {{#  } else{ }}
								    未上传
								  {{#  } }}
								</script>
								<!-- <a href="{{d.card_photo_head}}" target="_blank"></a>
									 <a href="{{d.card_photo_tail}}" target="_blank"></a>
								 -->
								<script type="text/html" id="card_photo_tail">
												  {{#  if(d.card_photo_tail){ }}
													<img style="max-height: 100%;" src="{{d.card_photo_tail}}" onclick="previewImg(this)">
												  {{#  } else{ }}
												    未上传
												  {{#  } }}
												</script>
				<script type="text/html" id="list-address">
					{{#  if(d.school_name){ }}
						{{d.school_name}}-{{d.institute_name}}-{{d.majors_name}}-{{d.grade_name}}-{{d.class_name}}班-{{d.dormitory_name}}-{{d.tung_name}}-{{d.room_name}}
					{{#  } else{ }}
						暂无填写
					{{#  } }}
				</script>
			</div>
		</div>
	</div>
</div>
<script>
	var formurl='member/memberform',formarea=['500px', '600px'];
	//表格数据渲染
	layui.use(['table', 'form','laydate'], function() {
		var table = layui.table,
			form = layui.form,
			$ = layui.$,laydate=layui.laydate;
		//日期范围
		laydate.render({
			elem: '#date'
			,type:'datetime'
			,range: true
		});
			layui.admin.initlist(table,'members/list',240,[
				[{
					field: 'member_id',
					title: 'ID',
					width: 60
				},{
					field: 'real_name',
					title: '真实姓名',
					width: 100
				},{
					field: 'sex',
					title: '性别',
					width: 70,
					templet:'#sex'
				},{
					field: 'tel',
					title: '电话',
					width: 150
				},{
					field: 'money',
					title: '余额(元)',
					width: 100
				},{
					field: 'school',
					title: '地址',
					minWidth: 350,
					templet:'#list-address'
				},{
					field: 'card_photo_head',
					title: '身份证正面',
					width: 100,
					templet:'#card_photo_head'
				},{
					field: 'card_photo_tail',
					title: '身份证反面',
					width: 100,
					templet:'#card_photo_tail'
				},{
					field: 'card_id',
					title: '身份证号码',
					width: 200
				},{
					field: 'member_status',
					title: '启用/锁定',
					width: 100,
					templet: '#list-tableF',
					fixed:'right'
				},{
					title: '操作',
					toolbar: '#list-toolbar',
					width: 420,
					fixed:'right'
				}]
			])
		//监听表格表单操作
		form.on('switch(list-tableF)', function(obj) {
			var json = JSON.parse(decodeURIComponent($(this).data('json')));
			json = table.clearCacheKey(json);
			layui.admin.ajax('members/update', {
					member_status:json.member_status == 1?2:1,
					member_id:json.member_id
				}).then(function(res){
					layui.table.reload('list-table');
				}).catch(function(res){});
			});
		
		//监听表格操作事件
		table.on('tool(list-table)', function(obj) {
			var data = obj.data;
			//删除
			if (obj.event === 'del') {
				layer.confirm('确定删除' + data.member_id + '?', function(index) {
					layui.admin.delF(table,'members/delete',{member_id: data.member_id});
				});
			} else if (obj.event === 'edit') { //编辑
				layui.admin.pupF('编辑会员',formarea,formurl, 2, data)
			} else if (obj.event === 'recharge'){//充值记录
				layui.admin.pupF(data.real_name+'的充值记录',['1050px', '600px'],'member/recharge',2,data)
			}else if(obj.event==='cons'){
				layui.admin.pupF(data.real_name+'的消费记录',['1050px', '600px'],'member/Cons_record',2,data)
			}else if(obj.event === 'distribute_agent'){
				layui.admin.member=data;

				layui.admin.pupF('选择代理', ['800px','600px'], 'member/agentselect',3);
			}else if(obj.event === 'distribute_admin'){
				layui.admin.member=data;
				layui.admin.pupF('选择管理员', ['800px','600px'], 'member/adminselect',3);
			}else if(obj.event === 'admin_revoke'){
				layui.admin.member=data;
				layui.admin.formapi('members/set_administer',{
					member_id:layui.admin.member.member_id,
					id:data.admin_id,
					type:3
				});
			}else if(obj.event === 'agent_revoke'){
				layui.admin.member=data;
				layui.admin.formapi('members/set_administer',{
					member_id:layui.admin.member.member_id,
					id:data.agent_id,
					type:3
				});
			}else if(obj.event==='list'){
				layui.admin.member=data;
				layui.admin.pupF('会员详情', ['1000px','600px'], 'member/member_detail.html?v='+Math.random(),2,data);
			}
		});
		//监听行双击事件
		/* table.on('rowDouble(list-table)', function(obj) {
			//查看详情
			if($('.memberlist').length){
				layui.admin.pupF('会员详情', formarea, formurl, 3, obj.data);
			}
		}); */
		var active = {
			//多行删除
			batchdel: function() {
					layui.admin.delsF(table,'members/delete','member_id');
				}
		};
		//操作dom
		$('.layui-btn.layuiadmin-btn-list').on('click', function() {
			var type = $(this).data('type');
			active[type] ? active[type].call(this) : '';
		});
		//搜索
		// $('#search').on('click', function() {
		// 	var val1 = $('input[name="user"]'),
		// 		val2 = $('input[name="member_id"]').val(),
		// 		val3 = $('input[name="member_status"]').attr('data');
		// 	//执行重载
		// 	table.reload('list-table', {
		// 		page: {
		// 			curr: 1 //重新从第 1 页开始
		// 		},
		// 		where: {
		// 			search_text: val1.val(), 
		// 			member_id: val2,
		// 			member_status: val3
		// 		}
		// 	});
		// });
		$('#search').on('click', function() {
			var obj=$(this).parents('.layui-form-item');
			var val1 = obj.find('input[name="user"]').val(),
			    //val2 = obj.find('input[name="member_id"]').val(),
					search_time=obj.find('input[name="val2"]').val(),
			    val2 = obj.find('input[name="status"]').attr('data');
			layui.admin.reloads({
				search_text:val1,
				datemin:search_time.split(' - ')[0],
				datemax:search_time.split(' - ')[1],
				status:val2
			});
		});
		//导出
		$('#pexcel').on('click', function() {
			var obj=$(this).parents('.layui-form-item');
			var val1 = obj.find('input[name="user"]').val(),
					//val2 = obj.find('input[name="member_id"]').val(),
			search_time=obj.find('input[name="val2"]').val(),
					val2 = obj.find('input[name="status"]').attr('data')
			;
			layui.admin.excel(table,'members/list',
					{
						search_text:val1,
						datemin:search_time.split(' - ')[0],
						datemax:search_time.split(' - ')[1],
						status:val2
					},'');
		});
	});
    
    function previewImg(obj) {
        var img = new Image();  
        img.src = obj.src;
        //var height = img.height + 50; // 原图片大小
        //var width = img.width; //原图片大小
        var imgHtml = "<img src='" + obj.src + "' width='auto' height='auto'/>"; 
        var width = 'auto';
        var height = 'auto';
          
        //弹出层
        layer.open({  
            type: 1,  
            shade: 0.8,
            offset: 'auto',
            area: [width,height],  // area: [width + 'px',height+'px']  //原图显示
            shadeClose:true,
            scrollbar: false,
            title: "图片预览", //不显示标题  
            content: imgHtml, //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响  
            cancel: function () {  
                //layer.msg('捕获就是从页面已经存在的元素上，包裹layer的结构', { time: 5000, icon: 6 });  
            }  
        }); 
    }
</script>
